import { VNodeChild } from "vue";

export type InputOption = {
  type?: "input" | "textarea" | "password";
  size?: "tiny" | "small" | "medium" | "large";
  placeholder?: string;
  disabled?: boolean;
  autofocus?: boolean;
  autosize?:
    | boolean
    | {
        minRows?: number | undefined;
        maxRows?: number | undefined;
      };
  clearable?: boolean;
  maxlength?: number;
  minlength?: number;
  readonly?: boolean;
  round?: boolean;
  rows?: number;
  showCount?: boolean;
  showPasswordOn?: "click" | "mousedown";
  prefix?: () => VNodeChild;
  suffix?: () => VNodeChild;
  allowInput?: (val: string) => boolean;
  onInput?: (val: string) => void;
  onBlur?: () => void;
  onFocus?: () => void;
  onClear?: () => void;
  onUpdate?: (val: string) => void;
};

export type NumberOption = {
  size?: "tiny" | "small" | "medium" | "large";
  placeholder?: string;
  disabled?: boolean;
  autofocus?: boolean;
  clearable?: boolean;
  readonly?: boolean;
  showButton?: boolean;
  // buttonPlacement?: "both" | "right";
  // min?: number;
  // max?: number;
  // step?: number;
  // precision?: number;
  // controls?: boolean;
  // keyboard?: { ArrowUp?: boolean; ArrowDown?: boolean };
  // format?: (value: number | null) => string;
  // prefix?: () => VNodeChild;
  // suffix?: () => VNodeChild;
  // onBlur?: () => void;
  // onFocus?: () => void;
  // onClear?: () => void;
  // onUpdate?: (val: number | null) => void;
};

export type FormItems = InputOption | NumberOption;

const a: FormItems = {
  type: "input",
  showButton: true,
};
